<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>

<jsp:include page="/public/template/header.jsp" />


<style type="text/css">
input.text {
	width: 400px;
}

input.button {
	width: 80px;
}

table,td,tr,th {
	border-style: solid;
	border-width: 0px;
	border-color: black;
	margin: 0;
	border-collapse: collapse;
	padding: 6px;
}

.table_properties {
	border-style: solid;
	border-width: 1px;
	border-color: black;
	margin: 1;
	border-collapse: collapse;
	padding: 6px;
}

.table_properties tr td {
	border: 1px solid #000;
}

#content {
	padding: 10px;
}
</style>


<div id="content" style="height: 2700px;">

	<h1>Resources: Edit a Resource</h1>

	<form action="<c:url value='/config/resources/update'/>" method="post">
		<div style="position: absolute; top: 150px; width: 450px;">

			<input type="hidden" value="${resource.id}" name="er.id" id="resource_id" />
			<table style="position: absolute; width: 90%">

				<tr>
					<td>URI:</td>
					<td><input name="er.uri" value="${resource.uri}" type="text"
						style="width: 400px" /></td>
				</tr>

				<tr>
					<td>RDF Type</td>
					<td>
						<input id="type"  name="er.rdfType"  type="text" value="${resource.rdfType}" style="width: 400px"/>
					</td>
				</tr>

				<tr>
					<td>Type:</td>
					<td><select name="er.isStatic">
							<c:choose>
								<c:when test="${resource.isStatic eq true}">
									<option selected value="true">Static</option>
									<option value="false">Dynamic</option>
								</c:when>
								<c:otherwise>
									<option value="true">Static</option>
									<option selected value="false">Dynamic</option>
								</c:otherwise>
							</c:choose>
					</select></td>
				</tr>
				<tr>
					<td><input type="submit" value="Edit" style="width: 150px;" /></td>
				</tr>
			</table>

		</div>
	</form>


	<div style="position: absolute; top: 350px; width: 100%;">
		<h3>Static Properties</h3>
		<button id="buttonNewStaticDataProperty">New Static Data
			Property</button>
		<div
			style="position: absolute; width: 95%;  max-height: 300px; min-height: 300px; overflow: scroll; ">
			<table style="position: absolute; width: 100%;" border="1"
				class="table_properties">
				<tr>
					<td><span style="font-weight: bold">Property</span></td>
					<td><span style="font-weight: bold">Value</span></td>
					<td><span style="font-weight: bold">Edit</span></td>
					<td><span style="font-weight: bold">Delete</span></td>
				</tr>

				<c:forEach items="${staticdps}" var="static" varStatus="status">
					<tr
						<c:if test="${status.count mod 2 == 1}">style="background-color:#ddd"</c:if>>
						<td>${static.parentProperty}</td>
						<td>${static.value}</td>
						<td><button class="editButtonStatic" value="${static.id }">Edit</button></td>
						<td><button class="deleteButtonStatic"
								name="${static.parentProperty}  ${static.value}"
								value="${static.id }">Delete</button></td>
					</tr>
				</c:forEach>
			</table>
		</div>
	</div>


	<div style="position: absolute; top: 750px; width: 100%;">
		<h3>Dynamic Properties</h3>
		<button id="buttonNewDynamicDataProperty">New Dynamic Data
			Property</button>
		<div
			style="position: absolute; width: 95%; max-height: 300px; min-height: 300px; overflow: scroll; ">
			<table style="position: absolute; width: 100%;" border="1"
				class="table_properties">
				<tr>
					<td><span style="font-weight: bold">Source</span></td>
					<td><span style="font-weight: bold">Type</span></td>
					<td><span style="font-weight: bold">Property</span></td>
					<td><span style="font-weight: bold">Unique</span></td>
					<td><span style="font-weight: bold">Group</span></td>
					<td><span style="font-weight: bold">Path</span></td>
					<td><span style="font-weight: bold">Delete</span></td>
					<td><span style="font-weight: bold">Edit</span></td>
				</tr>

				<c:forEach items="${dynamicdps}" var="dynamic" varStatus="status">
					<tr
						<c:if test="${status.count mod 2 == 1}">style="background-color:#ddd"</c:if>>
						<td><c:if test="${dynamic.sourceType == 'service'}">${dynamic.service.service}</c:if>
							<c:if test="${dynamic.sourceType == 'hook'}"> ${dynamic.webHook.url}</c:if>
						</td>
						<td>${dynamic.sourceType}</td>
						<td><span style="font-weight: bold">${dynamic.parentProperty}</span></td>

						<td><span style="font-weight: bold">${dynamic.isUnique}</span></td>

						<td><span style="font-weight: bold">${dynamic.xPathGroup}</span></td>
						<td><span style="font-weight: bold">${dynamic.xPath}</span></td>
						<td><button class="editButtonDynamic" value="${dynamic.id }">Edit</button></td>
						<td><button class="deleteButtonDynamic"
								name="${dynamic.parentProperty}" value="${dynamic.id}">Delete</button></td>
					</tr>
				</c:forEach>

			</table>
		</div>
	</div>


	<c:if test="${resource.isStatic eq true}">
		<div style="position: absolute; top: 1150px; width: 100%;">
			<h3>Virtual Properties</h3>
			<button id="buttonNewVirtualDataProperty">New Virtual Data
				Property</button>
			<div style="position: absolute; width: 95%; max-height: 400px; min-height: 400px; overflow: scroll; ">
				<table style="position: absolute; width: 100%;" border="1"
					class="table_properties">

					<tr>
						<td><span style="font-weight: bold">Property</span></td>
						<td><span style="font-weight: bold">Refresh Rate (sec)</span></td>
						<td><span style="font-weight: bold">Formula</span></td>
						<td><span style="font-weight: bold">Delete</span></td>
					</tr>

					<c:forEach items="${virtualdps}" var="vdp" varStatus="status">
						<tr style="background-color:#ddd">
							<td>${vdp.parentProperty}</td>
							<td>${vdp.refreshRate}</td>
							<td>${vdp.formula}</td>
							<td><button class="deleteButtonVirtual" name="${vdp.parentProperty}  ${vdp.formula}" value="${vdp.id }">Delete</button></td>
						</tr>
						<tr>
						<td colspan="2">
						<table class="table_properties">
									<tr>
										<td>Parameters</td>
									</tr>
								<c:forEach items="${vdp.formulaParameters}" var="fp" >
									<tr>
										<td>${fp.paramLabel}</td>
										<td>${fp.paramQuery}</td>
									</tr>
								</c:forEach>	
						</table>
	
						</td>
						<td colspan="2">
							<table class="table_properties">
								<tr>
									<td>Conditionals</td>
								</tr>
								<c:forEach items="${vdp.conditions}" var="cond" >
									<tr>
										<td>${cond.conditionRestriction}</td>
										<td>${cond.value}</td>
									</tr>
								</c:forEach>
								
							</table>
						</td>
						
						</tr>
						<tr>
							<td colspan="4"></td>
						</tr>

					</c:forEach>

				</table>
			</div>

		</div>
	</c:if>



	<div style="position: absolute; top: 1700px; width: 100%;">
		<h3>Object Properties</h3>
		<button id="buttonNewObjectProperty">New Object Property</button>
		<div style="position: absolute; width: 95%; max-height: 300px; min-height: 300px; overflow: scroll; ">
			<table style="position: absolute; width: 100%;" border="1"
				class="table_properties">
				<tr>
					<td><span style="font-weight: bold">Object URI</span></td>
					<td><span style="font-weight: bold">Predicate</span></td>
					<td><span style="font-weight: bold">Resource Dominant</span></td>
					<td><span style="font-weight: bold">Edit</span></td>
					<td><span style="font-weight: bold">Delete</span></td>
				</tr>

				<c:forEach items="${objectProperties}" var="objprop" varStatus="status">
					<tr>
						<td>${objprop.objectUri}</td>
						<td>${objprop.predicate}</td>
						<td>${objprop.isDominant}</td>						
						<td><button class="editButtonObjectProperty" value="${objprop.id}">Edit</button></td>
						<td><button class="deleteButtonObjectProperty" name="${objprop.objectUri} ${objpro.predicate}" value="${objprop.id}">Delete</button></td>
					</tr>
				</c:forEach>
			</table>
		</div>
	</div>



</div>



<script type="text/javascript">
	$(function() {

		
		//---------------------------STATIC DATA PROPERTIES------------------------------------------//
		$(".deleteButtonStatic").click(function() {
			var decisao = confirm("Are you sure? \n Static Property:\n " + $(this).attr("name") + "\n will be permanently deleted!");
			if (decisao) {
				var url = "<c:url value='/config/resources/'/>" + $("#resource_id").attr("value") + "/staticDataProperties/" + $(this).attr("value") + "/delete";
				$(location).attr('href', url);
			}
		});

		$(".editButtonStatic").click(function() {
			var url = "<c:url value='/config/resources/" + $("#resource_id").attr("value") + "/staticDataProperties/'/>" + $(this).attr("value");
			$(location).attr('href', url);
		});

		$("#buttonNewStaticDataProperty").click(function() {
			var url = "<c:url value='/config/resources/" + $("#resource_id").attr("value") + "/staticDataProperties/new'/>";
			$(location).attr('href', url);
		});

		//-----------------------------DYNAMIC DATA PROPERTIES----------------------------------------//
		$("#buttonNewDynamicDataProperty").click(function() {
			var url = "<c:url value='/config/resources/" + $("#resource_id").attr("value") + "/dynamicDataProperties/new'/>";
			$(location).attr('href', url);
		});

		$(".deleteButtonDynamic").click(function() {
			var decisao = confirm("Are you sure? \n Dynamic Property:\n " + $(this).attr("name") + "\n will be permanently deleted!");
			if (decisao) {
				var url = "<c:url value='/config/resources/'/>" + $("#resource_id").attr("value") + "/dynamicDataProperties/" + $(this).attr("value") + "/delete";
				$(location).attr('href', url);
			}
		});

		$(".editButtonDynamic").click(function() {
			var url = "<c:url value='/config/resources/" + $("#resource_id").attr("value") + "/dynamicDataProperties/'/>" + $(this).attr("value");
			$(location).attr('href', url);
		});

		//-----------------------------VIRTUAL DATA PROPERTIES----------------------------------------//
		$("#buttonNewVirtualDataProperty").click(function() {
			var url = "<c:url value='/config/resources/" + $("#resource_id").attr("value") + "/virtualDataProperties/new'/>";
			$(location).attr('href', url);
		});

		$(".deleteButtonVirtual").click(function() {
			var decisao = confirm("Are you sure? \n Virtual Property:\n " + $(this).attr("name") + "\n will be permanently deleted!");
			if (decisao) {
				var url = "<c:url value='/config/resources/'/>" + $("#resource_id").attr("value") + "/virtualDataProperties/" + $(this).attr("value") + "/delete";
				$(location).attr('href', url);
			}

		});
		
		//----------------------------OBJECT PROPERTIES-----------------------------------------//
		
		$("#buttonNewObjectProperty").click(function() {
			var url = "<c:url value='/config/resources/" + $("#resource_id").attr("value") + "/objectProperties/new'/>";
			$(location).attr('href', url);
		});

		$(".deleteButtonObjectProperty").click(function() {
			var decisao = confirm("Are you sure? \n Object Property:\n " + $(this).attr("name") + "\n will be permanently deleted!");
			if (decisao) {
				var url = "<c:url value='/config/resources/'/>" + $("#resource_id").attr("value") + "/objectProperties/" + $(this).attr("value") + "/delete";
				$(location).attr('href', url);
			}
		});

		$(".editButtonObjectProperty").click(function() {
			var url = "<c:url value='/config/resources/" + $("#resource_id").attr("value") + "/objectProperties/'/>" + $(this).attr("value");
			$(location).attr('href', url);
		});


		//----------------------------RDF TYPES-----------------------------------------//

		var rdfTypes = ${rdfTypes};
		
		$("#type").autocomplete({
			minLength : 0,
			source : rdfTypes
		});

	});
</script>

<jsp:include page="/public/template/footer.jsp" />